/*!
 * dialogBox v0.0.2
 * by gongqun
 * Copyright 2017.8
 * Date: fri August 11 2017
 * 添加了弹出框 确定 按钮扩展click方法BtnConfirm();若有需要可自行实现 2017年10月9日 包乾
 */

; (function ($, window, document) {

    var pluginName = 'dialogBox',
 		defaults = {

 		    width: null, //number,弹出层宽度
 		    height: null,  //number,弹出层高度
 		    autoSize: true,  //boolean,是否自适应尺寸,默认自适应
 		    autoHide: false,  //boolean,是否自自动消失，配合time参数共用
 		    time: 3000,  //number,自动消失时间，单位毫秒
 		    zIndex: 99999,  //number,弹出层定位层级
 		    hasMask: false,  //boolean,是否显示遮罩层
 		    maskClose: false, // boolean,点击遮罩层是否关闭弹框
 		    hasClose: false,  //boolean,是否显示关闭按钮
 		    hasBtn: false,  //boolean,是否显示操作按钮，如取消，确定
 		    confirmValue: null,  //string,确定按钮文字内容
 		    confirm: function () { }, //function,点击确定后回调函数
 		    cancelValue: null,  //string,取消按钮文字内容
 		    cancel: function () { },  //function,点击取消后回调函数，默认关闭弹出框
 		    effect: '', //string,动画效果：fade(默认),newspaper,fall,scaled,flip-horizontal,flip-vertical,sign,
 		    type: 'normal', //string,对话框类型：normal(普通对话框),correct(正确/操作成功对话框),error(错误/警告对话框)
 		    title: '',  //string,标题内容，如果不设置，则连同关闭按钮（不论设置显示与否）都不显示标题
 		    content: '',  //string,DOM object,jQuery Object,正文内容，可以为DOM对象，jQuery对象，纯字符串，html标签字符串，以及URL地址，当content为URL地址时，将内嵌目标页面的iframe。
 		    callback: function () { },   //function,回调函数
 		    close: function () { }  // 关闭回调
 		};

    function DialogBox(element, options) {
        this.element = element;
        this.settings = $.extend({}, defaults, options);
        this.init();
    }

    DialogBox.prototype = {

        //初始化弹出框
        init: function () {
            var that = this,
 				element = this.element;
            that.render(element);
            that.setStyle(element);
            that.show(element);
            that.trigger(element);
        },

        //获取元素id值
        getIdValue: function (element) {
            var $this = $(element),
                selectID = $this.attr('id');

            if (typeof (selectID) !== 'undefined') {
                return selectID;
            } else {
                selectID = '';
                return selectID;
            }
        },

        //创建弹出框
        create: function (element) {
            var that = this,
 				$this = $(element),
 				id = that.getIdValue(element),
 				title = that.settings.title,
 				hasBtn = that.settings.hasBtn,
 				hasMask = that.settings.hasMask,
 				hasClose = that.settings.hasClose,
 				confirmValue = that.settings.confirmValue,
 				cancelValue = that.settings.cancelValue,
 				dialogHTML = [];
            if (!title) {
                dialogHTML[0] = '<section id="' + id + '" class="dialogBox"><div class="dialogBoxContainer"><div class="dialogBoxContent"></div>';
            } else {
                if (!hasClose) {
                    dialogHTML[0] = '<section id="' + id + '" class="dialogBox"><div class="dialogBoxContainer"><div class="dialogBoxTitle"><h3>' + title + '</h3></div><div class="dialogBoxContent"></div>';
                } else {
                    dialogHTML[0] = '<section id="' + id + '" class="dialogBox"><div class="dialogBoxContainer"><div class="dialogBoxTitle"><h3>' + title + '</h3><span class="dialogBoxClose">×</span></div><div class="dialogBoxContent"></div>';
                }
            }

            if (!hasBtn) {
                dialogHTML[1] = '</div></section>';
            } else {
                if (confirmValue && cancelValue) {
                    dialogHTML[1] = '<div class="dialogBtn"><span class="dialogBtnConfirm">' + confirmValue + '</span><span class="dialogBtnCancel">' + cancelValue + '</span></div></div></section>';
                } else if (confirmValue) {
                    dialogHTML[1] = '<div class="dialogBtn"><span class="dialogBtnConfirm">' + confirmValue + '</span></div></div></section>';
                } else if (cancelValue) {
                    dialogHTML[1] = '<div class="dialogBtn"><span class="dialogBtnCancel">' + cancelValue + '</span></div></div></section>';
                } else {
                    dialogHTML[1] = '<div class="dialogBtn"><span class="dialogBtnConfirm">确定</span><span class="dialogBtnCancel">取消</span></div></div></section>';
                }
            }

            if (!hasMask) {
                dialogHTML[2] = '';
            } else {
                dialogHTML[2] = '<div id="' + id + '-dialogBoxMask" class="dialogBoxMask"></div>';
            }

            return dialogHTML;
        },

        //渲染弹出框
        render: function (element) {
            var that = this,
 				$this = $(element),
 				dialogHTML = that.create($this),
 				$content = that.parseContent(element);
            $this.replaceWith(dialogHTML[0] + dialogHTML[1]);
            if (typeof ($content) === 'object') {
                $content.appendTo('.dialogBoxContent');
            } else {
                if (that.getIdValue(element).indexOf('Q-message-box') > -1) {
                    $('#' + that.getIdValue(element)).html($content);
                } else {
                    $('#' + that.getIdValue(element) + ' .dialogBoxContent').append($content);
                }
            }

            $('body').append(dialogHTML[2]);
        },

        //解析并处理弹出框内容
        parseContent: function (element) {
            var that = this,
 				content = that.settings.content,
 				width = that.settings.width,
 				height = that.settings.height,
 				type = that.settings.type,
 				$iframe = $('<iframe>'),
 				random = (that.settings.content.indexOf('?') > -1 ? '&' : '?') + 'tmp=' + Math.random(),
 				urlReg = /^(https?:\/\/|\/|\.\/|\.\.\/)/;

            //是外部页面时
            if (urlReg.test(content)) {

                $iframe.attr({
                    src: content + random,
                    frameborder: 'no',
                    scrolling: 'no',
                    name: 'dialogBoxIframe',
                    id: 'dialogBoxIframe'
                })
 				.on('load', function () {

 				    //动态自适应iframe高度;
 				    var $iframe = $(window.frames['dialogBoxIframe'].document),
 						$iframeBody = $(window.frames['dialogBoxIframe'].document.body),
 						iframeWidth = $iframe.outerWidth() - 8,
 						iframeHeight = $iframe.outerHeight() - 16,
 						$dialogBox = $('#' + that.getIdValue(element)),
 						$content = $('#' + that.getIdValue(element) + ' .dialogBoxContent'),
 						$container = $('#' + that.getIdValue(element) + ' .dialogBoxContainer');

 				    dialogBoxWidth = iframeWidth + 40;
 				    dialogBoxHeight = iframeHeight + 130;

 				    if (that.settings.autoSize) {
 				        $(this).width(iframeWidth);
 				        $(this).height(iframeHeight);

 				        $iframeBody.css({
 				            margin: '0',
 				            padding: '0'
 				        });

 				        $content.css({
 				            width: iframeWidth + 'px',
 				            height: (iframeHeight - 24) + 'px'
 				        });

 				        $container.css({
 				            width: dialogBoxWidth + 'px',
 				            height: function () {
 				                if (that.settings.hasBtn) {
 				                    return dialogBoxHeight + 'px';
 				                } else {
 				                    return dialogBoxHeight - 54 + 'px';
 				                }
 				            }
 				        });

 				        $dialogBox.css({
 				            width: dialogBoxWidth,
 				            height: function () {
 				                if (that.settings.hasBtn) {
 				                    if (type === '' || type === 'normal') {
 				                        return dialogBoxHeight + 'px';
 				                    } else if (type === 'error' || type === 'correct') {
 				                        dialogBoxHeight = dialogBoxHeight + 4;
 				                        return dialogBoxHeight + 'px';
 				                    }
 				                } else {
 				                    return dialogBoxHeight - 50 + 'px';
 				                }
 				            },
 				            'margin-top': function () {
 				                if (that.settings.hasBtn) {
 				                    if (type === '' || type === 'normal') {
 				                        return -Math.round(dialogBoxHeight / 2) + 'px';
 				                    } else if (type === 'error' || type === 'correct') {
 				                        dialogBoxHeight = dialogBoxHeight;
 				                        return -Math.round(dialogBoxHeight / 2) + 'px';
 				                    }
 				                } else {
 				                    return -Math.round((dialogBoxHeight - 50) / 2) + 'px';
 				                }
 				            },
 				            'margin-left': -Math.round(dialogBoxWidth / 2) + 'px'
 				        });

 				    } else {
 				        $(this).width(that.settings.width - 40);
 				        $(this).height(that.settings.height - 130);
 				    }
 				});
                return $iframe;

                //是jQuery对象时
            } else if (content instanceof jQuery) {
                return content.clone(true, true);
                //是DOM对象时
            } else if (content.nodeType === 1 && content.nodeName === 'string') {
                return content.innerHTML;
            } else {
                return content;
            }
        },

        //显示弹出框
        show: function (element) {
            var that = this;
            $('#' + that.getIdValue(element)).css({ display: 'block' });

            setTimeout(function () {
                $('#' + that.getIdValue(element)).addClass('show');
            }, 50);

            $('#' + that.getIdValue(element) + '-dialogBoxMask').show();
        },

        //隐藏弹出框
        hide: function (element) {
            var that = this;
            var $this = $(element),
 				$dialogBox = $('#' + that.getIdValue(element)),
 				$iframe = $('#dialogBoxBoxIframe');

            $dialogBox.removeClass('show');

            setTimeout(function () {
                if ($iframe) {
                    $iframe.attr('src', '_blank');
                }

                $dialogBox.replaceWith('<div id="' + $this.attr('id') + '"></div/>');
                $('#' + that.getIdValue(element) + '-dialogBoxMask').remove();
            }, 150)
        },

        //设置弹出框样式
        setStyle: function (element) {
            var that = this,
 				$dialog = $('#' + that.getIdValue(element)),
 				$container = $('#' + that.getIdValue(element) + ' .dialogBoxContainer'),
 				$content = $('#' + that.getIdValue(element) + ' .dialogBoxContent'),
 				$mask = $('#' + that.getIdValue(element) + '-dialogBoxMask'),
 				type = that.settings.type,
 				EFFECT = 'effect';
            //弹出框外框样式
            $dialog.css({
                width: function () {
                    if (that.settings.width) {
                        if ($(this).width() > that.settings.width) {
                            return $(this).width();
                        } else {
                            return that.settings.width + 'px';
                        }
                    } else {
                        if (that.settings.autoSize) {
                            return $(this).width();
                        }
                    }
                },
                height: function () {
                    if (that.settings.height) {
                        if (type === '' || type === 'normal') {
                            return that.settings.height + 'px';
                        } else if (type === 'error' || type === 'correct') {
                            return that.settings.height + 4 + 'px';
                        }
                    } else {
                        if (that.settings.autoSize) {
                            return $(this).height();
                        }
                    }
                },
                'margin-top': function () {
                    var height;
                    if (type === '' || type === 'normal') {
                        if (that.settings.autoSize) {
                            height = $(this).height();
                        } else {
                            height = that.settings.height;
                        }
                    } else if (type === 'error' || type === 'correct') {
                        if (that.settings.autoSize) {
                            height = $(this).height();
                        } else {
                            height = that.settings.height + 4;
                        }
                    }
                    return -Math.round(height / 2) + 'px';
                },
                'margin-left': function () {
                    var width = $(this).width();
                    return -Math.round(width / 2) + 'px';
                },
                'z-index': that.settings.zIndex
            });

            //弹出框内层容器样式
            $container.css({
                width: function () {
                    if (that.settings.width) {
                        return that.settings.width + 'px';
                    } else {
                        return;
                    }
                },
                height: function () {
                    if (that.settings.height) {
                        return that.settings.height + 'px';
                    } else {
                        return;
                    }
                }
            });

            //弹出框内容样式
            $content.css({
                width: function () {
                    if (that.settings.width) {
                        return that.settings.width - 40 + 'px';
                    } else {
                        return;
                    }
                },
                height: function () {
                    if (that.settings.height) {
                        return that.settings.height - 154 + 'px';
                    } else {
                        return;
                    }
                }
            });

            //遮罩层样式
            $mask.css({
                height: $(document).height() + 'px'
            });


            //判断弹出框类型
            switch (that.settings.type) {
                case 'correct':
                    $container.addClass('correct');
                    break;
                case 'error':
                    $container.addClass('error');
                    break;
                default:
                    $container.addClass('normal');;
                    break;
            }

            //弹出框多种动画效果
            switch (that.settings.effect) {
                case 'newspaper':
                    $dialog.addClass(EFFECT + 'Newspaper');
                    break;
                case 'fall':
                    $dialog.addClass(EFFECT + 'Fall');
                    break;
                case 'scaled':
                    $dialog.addClass(EFFECT + 'Scaled');
                    break;
                case 'flip-horizontal':
                    $dialog.addClass(EFFECT + 'FlipHorizontal');
                    break;
                case 'flip-vertical':
                    $dialog.addClass(EFFECT + 'FlipVertical');
                    break;
                case 'sign':
                    $dialog.addClass(EFFECT + 'Sign');
                    break;
                default:
                    $dialog.addClass(EFFECT + 'Fade');
                    break;
            }

        },

        //弹出框触屏器(系列事件)
        trigger: function (element, event) {
            var that = this,
 				$this = $(element);

            if ($.isFunction(that.settings.callback)) {
                that.settings.callback();
            }

            $('#' + that.getIdValue(element) + ' .dialogBoxClose').on('click', function (event) {
                that.hide($this);
                event.stopPropagation();
            });
            $('#' + that.getIdValue(element) + '-dialogBoxMask').on('click', function (event) {
                if (that.settings.maskClose) {
                    that.hide($this);
                    event.stopPropagation();
                }
            });
            $('#' + that.getIdValue(element) + ' .dialogBtnConfirm').on('click', function (event) {
                if ($.isFunction(that.settings.confirm)) {
                    if (typeof (BtnConfirm) == "function") {
                        BtnConfirm();
                    }
                    var r = that.settings.confirm();
                    if (r != false) {
                        that.hide($this);
                        event.stopPropagation();
                    }
                }
            });
            $('#' + that.getIdValue(element) + ' .dialogBtnCancel').on('click', function (event) {
                if ($.isFunction(that.settings.cancel)) {
                    that.settings.cancel();
                    var r = that.settings.cancel();
                    if (r != false) {
                        that.hide($this);
                        event.stopPropagation();
                    }
                }
            });

            $(document).keyup(function (event) {
                if (event.keyCode === 27) {
                    that.hide($this);
                }
            });

            if (that.settings.autoHide) {
                setTimeout(function () {
                    that.hide($this);
                }, that.settings.time)
            }
        }

    };

    $.fn[pluginName] = function (options) {
        this.each(function () {
            if (!$.data(this, "plugin_" + pluginName)) {
                $.data(this, "plugin_" + pluginName, new DialogBox(this, options));
            }
        });
        return this;
    };

})(jQuery, window, document);
var Q = {};
Q.message = function (type, message, callback) {
    var t = 'normal';
    switch (type) {
        case "w": //warning
        case "warning":
            t = 'normal';
            break;
        case "s": //success
        case "success":
            t = 'correct';
            break;
        case "f": //fail
        case "fail":
            t = 'error';
            break;
    }
    var container = 'Q-message-box' + (Math.random() * 1000000).toString().substr(0, 3);
    $('body').append('<div id="' + container + '"></div>');
    message = '<div class="' + type + '_tip"><i></i><b>' + message + '</b></div>';
    $('#' + container).dialogBox({
        autoSize: true,  //boolean,是否自适应尺寸,默认自适应
        autoHide: true,  //boolean,是否自自动消失，配合time参数共用
        time: 3000,  //number,自动消失时间，单位毫秒
        zIndex: 999999,  //number,弹出层定位层级
        hasMask: false,  //boolean,是否显示遮罩层
        type: t, //string,对话框类型：normal(普通对话框),correct(正确/操作成功对话框),error(错误/警告对话框)
        title: '',  //string,标题内容，如果不设置，则连同关闭按钮（不论设置显示与否）都不显示标题
        content: message,  //string,DOM object,jQuery Object,正文内容，可以为DOM对象，jQuery对象，纯字符串，html标签字符串，以及URL地址，当content为URL地址时，将内嵌目标页面的iframe。
        callback: function () { //function,回调函数
            if (typeof (callback) == "function")
                callback();
        },
        close: function () { // 关闭回调
            $('#' + container).remove();
        }
    });
};
Q.alert = function (type, message, title, btn, callback, width) {
    var t = 'normal';
    switch (type) {
        case "w":
            //warning
        case "warning":
            t = 'normal';
            break;
        case "s":
            //success
        case "success":
            t = 'correct';
            break;
        case "f":
            //fail
        case "fail":
            t = 'error';
            break;
    }

    var container = 'Q-alert-box' + (Math.random() * 1000000).toString().substr(0, 3);
    $('body').append('<div id="' + container + '"></div>');
    $('#' + container).dialogBox({
        width: width ? width : 300, //number,弹出层宽度
        autoSize: true,  //boolean,是否自适应尺寸,默认自适应
        zIndex: 999999,  //number,弹出层定位层级
        hasMask: true,  //boolean,是否显示遮罩层
        hasClose: false,  //boolean,是否显示关闭按钮
        maskClose: false, // boolean,点击遮罩层是否关闭弹框
        hasBtn: true,  //boolean,是否显示操作按钮，如取消，确定
        confirmValue: btn || '确定',  //string,确定按钮文字内容
        confirm: function () { //function,点击确定后回调函数
            if (typeof (callback) == "function")
                callback();
        },
        type: t, //string,对话框类型：normal(普通对话框),correct(正确/操作成功对话框),error(错误/警告对话框)
        title: title || '提示',  //string,标题内容，如果不设置，则连同关闭按钮（不论设置显示与否）都不显示标题
        content: message,  //string,DOM object,jQuery Object,正文内容，可以为DOM对象，jQuery对象，纯字符串，html标签字符串，以及URL地址，当content为URL地址时，将内嵌目标页面的iframe。
        callback: function () { },  //function,回调函数
        close: function () { // 关闭回调
            $('#' + container).remove();
        }
    });
};
Q.confirm = function (message, title, confirm, confirmCallback, cancel, cancelCallback) {
    var container = 'Q-confirm-box' + (Math.random() * 1000000).toString().substr(0, 3);
    $('body').append('<div id="' + container + '"></div>');
    $('#' + container).dialogBox({
        width: 300, //number,弹出层宽度
        autoSize: true,  //boolean,是否自适应尺寸,默认自适应
        zIndex: 999999,  //number,弹出层定位层级
        hasMask: true,  //boolean,是否显示遮罩层
        maskClose: false, // boolean,点击遮罩层是否关闭弹框
        hasClose: true,  //boolean,是否显示关闭按钮
        hasBtn: true,  //boolean,是否显示操作按钮，如取消，确定
        confirmValue: confirm || '确定',  //string,确定按钮文字内容
        confirm: function () { //function,点击确定后回调函数
            if (typeof (confirmCallback) == "function")
                confirmCallback();
        },
        cancelValue: cancel || '取消',  //string,取消按钮文字内容
        cancel: function () {  //function,点击取消后回调函数，默认关闭弹出框
            if (typeof (cancelCallback) == "function")
                cancelCallback();
        },
        type: 'normal',
        title: title || '询问',  //string,标题内容，如果不设置，则连同关闭按钮（不论设置显示与否）都不显示标题
        content: message,  //string,DOM object,jQuery Object,正文内容，可以为DOM对象，jQuery对象，纯字符串，html标签字符串，以及URL地址，当content为URL地址时，将内嵌目标页面的iframe。
        callback: function () { },  //function,回调函数
        close: function () { // 关闭回调
            $('#' + container).remove();
        }
    });
};